<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <title>01.helloReact</title>
  </head>
  <body>
    <!-- 2. 准备一个根容器：将来React内容都会渲染到容器内部 -->
    <div id="root"></div>
    <!-- 1. 引入 react 相关的库：注意引用顺序 -->
    <!-- 引入 react 库，暴露 React 函数对象 -->
    <script src="./lib/react.development.js"></script>
    <script src="./lib/react-dom.development.js"></script>

    <script>
      const element = React.createElement(
        "h1", //元素类型
        {
          id: "title",
          title: "这是一个标题",
        }, //元素属性
        "Hello React!" //元素内容
      );

      const root = ReactDOM.createRoot(document.getElementById("root"));
      root.render(element);
    </script>
  </body>
</html>
